<%@ page import="com.kma.ncpractice2013.dao.OrderDAO" %>
<%@ page import="com.kma.ncpractice2013.model.Order" %>
<%@ page import="java.util.List" %>
<%@ page import="org.json.JSONObject" %>
<%@ page import="com.kma.ncpractice2013.dao.LocationDAO" %>
<%@ page import="java.util.ArrayList" %>
<%--
  User: Viktor
  Date: 10/13/13
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title></title>
    <style>
        th{
            font-weight: normal;
            background-color: #652299;
            color: white;
        }
        tr{
            background-color: #F4E3FF;

        }
        tr:hover { background: #be4bff }
        table{
            font: sans-serif;
            font-family: Helvetica;
            border: 0;

        }
    </style>
    <script type = "text/javascript" src="https://code.jquery.com/jquery-1.9.1.js"></script>
    <script>
        function doReport()
        {

            var selected_report = $('#report_type').val();
            switch (true) {
                case (selected_report == "top_price"):
                    report_top_price();
                    break;
                case (selected_report == "top_dest"):
                    report_top_dest();
                    break;

                default:

            }

        }


        function report_top_price()
        {
            <%
                OrderDAO orderDAO = new OrderDAO();
                List<Order> orderList = orderDAO.getAllOrderedBy("price", 10, 0);

                LocationDAO locationDAO = new LocationDAO();
                List<String> locationsList = new ArrayList<String>();
                for(Order o:orderList)
                locationsList.add((locationDAO.getById(o.getLocationId())).getName());

                String locations_list = JSONObject.valueToString(locationsList);
                String order_list = JSONObject.valueToString(orderList);
            %>
            var orders = <%=order_list%>;
            var locations = <%=locations_list%>;
            var rowstring = "";
            rowstring+='<tr>';

            rowstring+='<th>'+ "Location" +'</th>';
            rowstring+='<th>'+ "Price" +'</th>';
            rowstring+='<th>'+ "CheckIn Date" +'</th>';
            rowstring+='<th>'+ "CheckOut Date" +'</th>';
            rowstring+='<th>'+ "Stars" +'</th>';

            rowstring+='</tr>';
            $('#reports').append(rowstring);
            $.each(orders, function(index, element){
                rowstring = "";

                rowstring+='<tr>';

                rowstring+='<td>'+ locations[index] +'</td>';
                rowstring+='<td>'+ element.price +'</td>';
                rowstring+='<td>'+ element.checkInDate +'</td>';
                rowstring+='<td>'+ element.checkOutDate +'</td>';
                rowstring+='<td>'+ element.hotelStars +'</td>';

                rowstring+='</tr>';
                $('#reports').append(rowstring);
            })
        }
    </script>
</head>
<body>

<div id="base">
    <div id="reports_div" style="left: 10; float: left; position: absolute; width: 50%">
        <table id="reports" class="reportTable"></table>
    </div>
    <div id="controls" style="right: 10; position: relative; float: right; width: 50%">
        <select name="report_type" style="width: 150; right: 10" id="report_type">
            <option value="top_price">Most valuable orders</option>
            <option value="top_dest">Most popular destinations</option>

        </select>
        <br>
        <input type="button" onclick="doReport()" value="Create">
    </div>
</div>

</body>
</html>